import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { ColorSuit, FieldValueMap } from 'src/components/scenarios/models';

@Component({
  selector: 'app-field-value-map-config-dialog',
  templateUrl: './field-value-map-config-dialog.component.html',
  styleUrl: './field-value-map-config-dialog.component.scss'
})
export class FieldValueMapConfigDialogComponent implements OnInit {
  visible: boolean = false;
  item!: FieldValueMap;
  colors: ColorSuit[] = [];

  @Output()
  editConfirm: EventEmitter<FieldValueMap> = new EventEmitter();

  ngOnInit(): void {
    fetch("/assets/data/colors.json").then(res => res.json()).then(data => this.colors = data);
  }

  onShow(item?: FieldValueMap) {
    if (item) {
      this.item = { ...item };
    } else {
      this.item = {
        Id: '',
        Key: 0,
        Description: '',
        Color: '#ff0000'
      };
    }
    this.visible = true;
  }

  onEditConfirm() {
    this.visible = false;
    this.editConfirm.next(this.item);
  }
  onEditCancel() {
    this.visible = false;
  }
}
